Skip to content

fix(select): select focused option on Enter in popover and modal interfaces#31093

Open
ShaneK wants to merge 2 commits intomainfrom
FW-6754
Open

fix(select): select focused option on Enter in popover and modal interfaces#31093
ShaneK wants to merge 2 commits intomainfrom
FW-6754

Conversation

@ShaneK
Copy link
Copy Markdown
Member

@ShaneK ShaneK commented Apr 23, 2026

Issue number: resolves #30561


What is the current behavior?

When an ion-select with interface="popover" or interface="modal" is opened with the keyboard, pressing Enter on a focused option doesn't commit the value or dismiss the overlay. Only Space works. The onKeyUp handlers in select-popover.tsx and select-modal.tsx only checked for ' ', despite the comment claiming Enter was supported, and ion-radio-group's arrow-key handler never committed the focused value on Enter the way native <select> does.

What is the new behavior?

Pressing Enter on a focused option in the popover or modal interface now commits that option as the select's value and dismisses the overlay, matching Space and native <select> behavior. radio-group.tsx gains an Enter branch inside its select-interface arrow-key handler that sets value to the focused radio and emits ionChange when it differs from the previous value. select-popover.tsx and select-modal.tsx track the onKeyDown target so onKeyUp only dismisses when the Enter press started on the same option. That guard stops a held Enter on the triggering ion-select from re-firing inside the just-opened overlay and auto-dismissing it. The !ev.repeat check on keydown covers the same case for the radio-group commit.

Does this introduce a breaking change?

  • Yes
  • No

Other information

The keydown/keyup target-matching pattern is the same trick the browser uses to avoid firing a click when keydown and keyup happen on different elements. It's needed here because Enter on the ion-select trigger opens the overlay on keydown, and without the guard the corresponding keyup (now inside the overlay) would immediately commit and dismiss.

Preview page:

@ShaneK ShaneK requested a review from a team as a code owner April 23, 2026 17:17
@ShaneK ShaneK requested a review from gnbm April 23, 2026 17:17
@vercel
Copy link
Copy Markdown

vercel Bot commented Apr 23, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
ionic-framework Ready Ready Preview, Comment Apr 23, 2026 5:18pm

Request Review

Copy link
Copy Markdown
Contributor

@thetaPC thetaPC left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package: core @ionic/core package

Projects

None yet

Development

Successfully merging this pull request may close these issues.

bug: Select-Popover does not select the element when enter is pressed

2 participants